<template>
	<view class="u-page coreshop-flex coreshop-flex-direction">
		<u-toast ref="uToast" /><u-no-network></u-no-network>
		<u-navbar :title="title" safeAreaInsetTop fixed placeholder>
		    <view class="coreshop-navbar-left-slot" slot="left">
		        <u-icon name="arrow-left" size="19" @click="goNavigateBack"></u-icon>
		        <u-line direction="column" :hairline="false" length="16" margin="0 8px"></u-line>
		        <u-icon name="home" size="22" @click="goHome"></u-icon>
		    </view>
		    <view slot="right">
		    </view>
		</u-navbar>
		<view class="coreshop-flex coreshop-flex-direction search-box">
			<view class="search-input">
				<u-search
					v-model="keyword"
					@custom="goSearch"
					:clearabled="false"
					placeholder="请输入标题关键词"
					height="38"
					:searchIcon="null"
					bgColor="#F1F1F5"
					placeholderColor="#A2A6AC" 
					:actionStyle="{width:'130rpx',height:'78rpx',background:'#2A8FFC','border-radius':'25px','margin-left':'20rpx','font-size':'28rpx',color:'#fff','line-height':'80rpx','text-align':'center'}">
				</u-search>
			</view>
			
			<view class="coreshop-flex coreshop-flex-direction-row coreshop-justify-around" style="height: 80rpx;">
				<view class="coreshop-flex coreshop-flex-direction-row coreshop-justify-center coreshop-align-center" @click="funSelect(1)">
					<u--text :type="clickVal==1 ? 'primary' :''" text="未完成"></u--text> 
					<u-icon :name="[(clickVal==1 && selectPopShow) ? 'arrow-up':'arrow-down']" :color="clickVal==1 ? '#2A8FFC' :'#606266'" size="14" bold="true"></u-icon>
				</view>
				<view class="coreshop-flex coreshop-flex-direction-row coreshop-justify-center coreshop-align-center" :class="{ disabled: isDisabled }"  @click="funSelect(1)">
					<view><u--text :type="clickVal==2 ? 'primary' :''" :text="jhText"></u--text> </view>
					<view><u-icon :name="[(clickVal==2 && selectPopShow) ? 'arrow-up':'arrow-down']" :color="clickVal==2 ? '#2A8FFC' :'#606266'" size="14" bold="true"></u-icon></view>
				</view>
				<view class="coreshop-flex coreshop-flex-direction-row coreshop-justify-center coreshop-align-center"  @click="funSelect(3)">
					<u--text :type="clickVal==3 ? 'primary' :''" text="计划时间"></u--text> 
					<u-icon :name="[(clickVal==3 && selectPopShow) ? 'arrow-up':'arrow-down']" :color="clickVal==3 ? '#2A8FFC' :'#606266'" size="14" bold="true"></u-icon>
				</view>
				<view class="coreshop-flex coreshop-flex-direction-row coreshop-justify-center coreshop-align-center"  @click="funSelect(4)">
					<u--text :type="clickVal==4 ? 'primary' :''" text="完成时间"></u--text> 
					<u-icon :name="[(clickVal==4 && selectPopShow) ? 'arrow-up':'arrow-down']" :color="clickVal==4 ? '#2A8FFC' :'#606266'" size="14" bold="true"></u-icon>
				</view> 
			</view>
			<u-line></u-line>
			<view class="coreshop-flex coreshop-flex-direction" v-show="selectPopShow" style="background-color: #F7F7F7;z-index: 1000;">
				<template v-if="clickVal==1">
					<view class="coreshop-flex coreshop-flex-direction-row c-m-l-20 c-m-r-20" style="height: 80rpx;" @click="funSubSelect(1)">
						<u--text text="已完成" :type="selectVal==1 ? 'primary' :''"></u--text>
						<u-icon v-if="selectVal==1" name="checkbox-mark" color="#2A8FFC" size="20" bold="true"></u-icon>
					</view>
					<u-line></u-line>
					<view class="coreshop-flex coreshop-flex-direction-row c-m-l-20 c-m-r-20" style="height: 80rpx;" @click="funSubSelect(2)">
						<u--text text="未完成" :type="selectVal==2 ? 'primary' :''"></u--text>
						<u-icon v-if="selectVal==2" name="checkbox-mark" color="#2A8FFC" size="20" bold="true"></u-icon>
					</view>
				</template>
				<template v-if="clickVal==3 || clickVal==4">
					<u-line></u-line>
					<view class="coreshop-flex coreshop-flex-direction-row c-m-l-20 c-m-r-20" style="height: 80rpx;" @click="selectDate(1)">
						<u--text text="全部" :type="selectVal==3 ? 'primary' :''"></u--text>
						<u-icon v-if="selectVal==3" name="checkbox-mark" color="#2A8FFC" size="20" bold="true"></u-icon>
					</view>
					<u-line></u-line>
					<view class="coreshop-flex coreshop-flex-direction-row c-m-l-20 c-m-r-20" style="height: 80rpx;" @click="selectDate(2)">
						<u--text text="自定义" :type="selectVal==4 ? 'primary' :''"></u--text>
						<u-icon v-if="selectVal==4" name="checkbox-mark" color="#2A8FFC" size="20" bold="true"></u-icon>
					</view>
				</template>
				<u-line></u-line>
			</view> 
		 
		<!-- 	<template v-if="planType==4">
				<u-dropdown ref="uDropdown" @open="open" v-if="FBZT == '1'" title-size="24">
					<u-dropdown-item
						@change="change"
						:title="typeName" 
						:options="typeList"
						:disabled="disabledType"
						menu-icon-size="12"
						v-model="JHLX">
					</u-dropdown-item>
					<u-dropdown-item
						@change="changeStatus"
						:title="JHZT == '1'?'未完成':'已完成'" 
						v-model="JHZT" 
						:options="[{label: '未完成',value: 1,},{label: '已完成',value: 2,}]" >
					</u-dropdown-item>
					<u-dropdown-item
						title="按部门"
						height = "400"
						menu-icon-size="12"
						v-model="JGMC">
						<view  class="sub-client-content">
							<scroll-view scroll-y="true" style="max-height: 400rpx;">
								<template v-if="subdepartmentList.length > 0">
									<u-grid :col="2">
										<u-grid-item v-for="(item,index) in subdepartmentList" :key="index" :custom-style="{padding:'0rpx',minHeight:'80rpx'}" @click="selectSub(index)">
											<view :class="[BMID == item.ID ? 'active' : '']">{{item.label}}</view>
										</u-grid-item>
									</u-grid>
								</template>
								<view v-else class="over-hidden">
									<u-loadmore status="nomore" margin-top="40" margin-bottom="40" :load-text="{nomore:'暂无数据'}"/>
								</view>
							</scroll-view>
						</view>
					</u-dropdown-item>
					<u-dropdown-item
						title="按人员"
						height = "400"
						menu-icon-size="12"
						v-model="JGMC">
						<view  class="sub-client-content">
							<scroll-view scroll-y="true" style="max-height: 400rpx;">
								<template v-if="subList.length > 0">
									<view v-for="(item,index) in subList" :key="index">
										<u-grid :col="2">
											<u-grid-item v-for="(items,idx) in item.items" :key="idx" :custom-style="{padding:'0rpx',minHeight:'80rpx'}" @click="selectSubPerson(index,idx)" class="sub-content-box">
												<view :class="[YWYID == items.id ? 'active' : '']" class="u-flex sub-content">
													<view class="title-icon">
														<text>{{item.title}}</text>
													</view>
													<view class="u-flex-1">{{items.name}} ({{$Utils.getLabelFromID(items.SSZWBH,positionList) || '--'}})</view>
												</view>
											</u-grid-item>
										</u-grid>
									</view>
								</template>
								<view v-else class="over-hidden">
									<u-loadmore status="nomore" margin-top="40" margin-bottom="40" :load-text="{nomore:'暂无数据'}"/>
								</view>
							</scroll-view>
						</view>
					</u-dropdown-item>
				</u-dropdown>
			</template>
			<template v-else>
				<u-dropdown ref="uDropdown" @open="open2" v-if="FBZT == '1'" title-size="24">
					<u-dropdown-item
						@change="changeStatus"
						:title="JHZT == '1'?'未完成':'已完成'" 
						v-model="JHZT" 
						:options="[{label: '未完成',value: 1,},{label: '已完成',value: 2,}]" >
					</u-dropdown-item>
					<u-dropdown-item
						@change="change"
						:title="typeName" 
						:options="typeList"
						:disabled="disabledType"
						menu-icon-size="12"
						v-model="JHLX">
					</u-dropdown-item>
					<u-dropdown-item title="计划时间">
						<view class="slot-content" style="background-color: #FFFFFF;">
							<view :class="['select-time-list u-flex u-row-between', planCur==1 ? 'active':'']" @click="selectDate(1)">全部</view>
							<view :class="['select-time-list u-flex u-row-between', planCur==2 ? 'active':'']" @click="selectDate(2)">自定义</view>
						</view>
					</u-dropdown-item>
					<u-dropdown-item title="完成时间">
						<view class="slot-content" style="background-color: #FFFFFF;">
							<view :class="['select-time-list u-flex u-row-between', finishCur==1 ? 'active':'']" @click="selectDate(1)">全部</view>
							<view :class="['select-time-list u-flex u-row-between', finishCur==2 ? 'active':'']" @click="selectDate(2)">自定义</view>
						</view>
					</u-dropdown-item>
				</u-dropdown>
				
				<u-dropdown ref="uDropdown" @open="open" v-else>
					<u-dropdown-item
						@change="change"
						:title="typeName" 
						:options="typeList" 
						menu-icon-size="12"
						v-model="JHLX">
					</u-dropdown-item>
					<u-dropdown-item title="计划时间">
						<view class="slot-content" style="background-color: #FFFFFF;">
							<view :class="['select-time-list u-flex u-row-between', planCur==1 ? 'active':'']" @click="selectDate(1)">全部</view>
							<view :class="['select-time-list u-flex u-row-between', planCur==2 ? 'active':'']" @click="selectDate(2)">自定义</view>
						</view>
					</u-dropdown-item>
					<u-dropdown-item title="完成时间">
						<view class="slot-content" style="background-color: #FFFFFF;">
							<view :class="['select-time-list u-flex u-row-between', finishCur==1 ? 'active':'']" @click="selectDate(1)">全部</view>
							<view :class="['select-time-list u-flex u-row-between', finishCur==2 ? 'active':'']" @click="selectDate(2)">自定义</view>
						</view>
					</u-dropdown-item>
				</u-dropdown>
				
			</template> -->
			
		</view>
		<scroll-view class="content" scroll-y @scrolltolower="scrollBottom" style="position: absolute;top: 400rpx;" :class="[selectPopShow ? cardNoneClass:cardShowClass]">
			<view class="select-tag" v-if="planDateVal.length>0">当前选中计划时间:{{planDateVal[0]}}~{{planDateVal[1]}}</view>
			<view class="select-tag" v-if="finishDateVal.length>0">当前选中完成时间:{{finishDateVal[0]}}~{{finishDateVal[1]}}</view>
			<view style="content:''; overflow: hidden;"></view>
			<block v-for="(item,index) in List" :key="index" >
				<view class="coreshop-flex coreshop-flex-direction uCard" @click="goDetail(item.id,planType)">
					<view slot="head" class="list-head">
						<view class="head-title">{{item.gzjh}} <text class="complete-num" v-if="FBZT == '1' && planType==1">({{item.complete}})</text></view>
						<view class="head-time">最近修改时间：{{$common.longDateFormate(item.chgTime) || '--'}}</view> 
					</view>
					<u-line></u-line>
					<view slot="body" class="coreshop-flex coreshop-flex-direction-row coreshop-justify-between list-body">
						<view class="coreshop-flex coreshop-flex-direction-column coreshop-align-start">
							<view class="coreshop-flex">
								<view class="list-content coreshop-flex-sub">
									<view class="plan-info">{{item.jhxq.jhfl || ''}}</view>
									<view class="plan-info">{{item.jhxq.jhxq || ''}}</view> 
								</view>
							</view>
							<view class="coreshop-flex c-m-t-20">
								<u-tag 
									plain 
									:text="getLabelFromID(item.jhlx) || '--'" 
									size="mini"
									shape="circle"
									mode="plain"
									color="#2A8FFC"
									border-color="#2A8FFC"/>
								<u-icon
									name="chat-fill" 
									custom-prefix="custom-icon" 
									color="#C0C0C0" 
									size="18"
									:custom-style="{'margin-left':'24rpx','margin-top':'4rpx'}">
								</u-icon>
								<view class="msg-num c-m-t-4">{{item.reviewSum}}</view>
							</view>
						</view>
						<view class="coreshop-flex">
							<u-icon
								name="arrow-right" 
								custom-prefix="custom-icon" 
								color="#E5E5E5" 
								size="20">
							</u-icon>
						</view>
					</view>
				<!-- 	<view slot="foot"> 
						发布人：{{ item.addAccName }}
					</view> -->
				</view>
			</block>
			
			<view class="over-hidden">
				<u-loadmore :status="listStatus" margin-top="40" margin-bottom="40"/>
			</view>
			
		</scroll-view>
		
		<w-picker
			:visible.sync="visible"
			mode="range" 
			startYear="2000" 
			endYear="2030"
			:value="rangeVal"
			:current="false"
			@confirm="onConfirm($event)"
			@cancel="onCancel"
			ref="range" 
		></w-picker>
		 
		<navigator class="coreshop-flex coreshop-justify-center add-btn" :url="`/packagePlan/pages/addPlan/index?plantype=${JHLX}`" v-if="disabledType">
			<u-icon name="plus" color="#fff" size="20" bold="true"></u-icon>
		</navigator>
		
	</view>
</template>

<script>
 //  import { mapState, mapGetters, mapActions } from 'vuex'
	  import wPicker from "@/pages/member/agent/components/w-picker/w-picker.vue"
	
	export default{
		data(){
			return {
				isDisabled: true,
				selectPopShow:false,
				clickVal:0,
				selectVal:0,
				jhText:'周计划',
				 
				cardShowClass:'cardShow',	
				cardNoneClass:'cardNone',
				 
				planType:'1',//1.发布计划 2.关联计划 4.评阅计划
				FBZT: 1,//计划是否已发布
				typeList: [],
				JHLX: 0,

				disabledType:false, //禁止选择计划类型
				
        keyword:'',//关键词
				List:[],//列表
				listCount:0,//总数
        pageNum:1,
				pageSize:20,
				listStatus:'nomore',
				searchData: { 
				    where: {},
				    limit: 20,
				    page: 1 
				},
				
				dropIdx:'',//当前选中的时间类型
				rangeVal:[],//默认数据
				visible:false,
				finishCur:'',
				finishDateVal:[],
				planCur:'',
				planDateVal:[],
				
				JHZT:1,
				subList:[],//下属列表
				userData:{},

				BMID:'',//部门id
				YWYID:'',//用户id
				title:''
			}
		},
    components:{
    	 wPicker,
    },
    computed:{
      // ...mapState(['positionList','subdepartmentList']),
      typeName:function(){
        const n = this.JHLX;
        if(n){
          return this.typeList.find(item=>item.value == n).label
        }
        return '计划类型'
      }
    },
	onLoad(e) {
		this.typeList = this.$db.get('workPlanType');
		this.typeList.push({label: '全部',value: 0,});
      console.log(e)
			let title = '我发布的计划';
			if(e.planAuth){
				this.planType = e.planAuth;
				e.planAuth=='2' && (title = '我收到的计划');
				e.planAuth=='4' && (title = '评阅计划');
			}
			if(e.draft){
				this.FBZT = 0;
				title = '草稿箱';
			}
			
			//年 周 月 直接跳转
			if(e.planClass){
				let planclass = e.planClass
				this.JHLX = planclass;
				const planClassInfo = {
					2:'周计划',
					3:'月计划',
					4:'年计划',
					7:'会议记录计划',
					9:'上级发布计划',
					8:'备忘事项'
				}
				let classname = planClassInfo[planclass] || '';
				title = `我发布的${classname}`;
				this.disabledType = true;
			}
			
			// uni.setNavigationBarTitle({
			// 	title:title
			// })
			this.title=title;
			
			const userData = uni.getStorageSync('userData') || '';
			if(userData){
				this.userData = JSON.parse(userData).Client;
			}
			
			// if(!this.positionList.length){
   //     this.getListFromAPI({vm:this,name:'positionList'})
			// }
			
			// if(!this.subdepartmentList.length){
			// 	const code = this.userData.SSJGBH;
   //     this.getListFromAPI({vm:this,name:'subdepartmentList',params:{SSJGBH:code}})
			// }
			
			//this.getXSSJList();
	},
	onShow(){
		this.goSearch()
	},
	methods:{
		//下拉菜单
		funSelect(val){
			if(this.clickVal==val)
				this.selectPopShow=!this.selectPopShow;
			else
				this.selectPopShow= true;
			this.clickVal=val;
			this.dropIdx=val-2;
		},
		funSubSelect(val){
			this.selectVal=val;
			this.selectPopShow=false; 
			if(clickVal==1)  this.JHZT=val; 
		},
		 
      // ...mapActions(['getListFromAPI']),
    goSearch(){//搜索
      	this.pageNum = 1;
      	this.List = [];
      	this.getList();
      	// this.$refs.uDropdown.close();
      },
	// 统一返回筛选条件 查询条件 分页
	conditions() {
		var where = {};
		if(this.keyword != ''){
			where = {
			    JHBT: this.keyword
			};
		}
	//	where.JHLX= this.JHLX;
		//where.JHZT= this.JHZT;
		
		this.searchData.page = this.pageNum;
		this.searchData.limit = this.pageSize;
		if(this.planType=='1'){
			//where.FBZT = this.FBZT;
		}
		if(this.planDateVal.length>0){
			where.JHStartTime = this.planDateVal[0] + ' 00:00:00';
			where.JHEndTime = this.planDateVal[1] + ' 23:59:59';
		}
		if(this.finishDateVal.length>0){
			where.CompletionStartTime = this.finishDateVal[0] + ' 00:00:00';
			where.CompletionEndTime = this.finishDateVal[1] + ' 23:59:59';
		}
		
		this.searchData.where = where; 
	    let data = this.searchData;
	    var newData = this.$u.deepClone(data);
	    if (data.where) {
	        newData.where = JSON.stringify(data.where);
	    } 
	    return newData;
	},
	getList(){
				uni.showLoading({
					title:'加载中',
					mask:true
				})
				/* let params = {
          JHBT: this.keyword,
          JHLX: this.JHLX || '',
          JHZT: this.JHZT || '',
          pageSize: this.pageSize,
          pageNum: this.pageNum
        }
        
				if(this.planType=='1'){
					params.FBZT = this.FBZT;
				}
				if(this.planDateVal.length>0){
					params.JHStartTime = this.planDateVal[0] + ' 00:00:00';
					params.JHEndTime = this.planDateVal[1] + ' 23:59:59';
				}
				if(this.finishDateVal.length>0){
					params.CompletionStartTime = this.finishDateVal[0] + ' 00:00:00';
					params.CompletionEndTime = this.finishDateVal[1] + ' 23:59:59';
				} */
				
				this.listStatus = 'loading';
				if(this.planType=='1'){ //发布的计划
					this.$u.api.getGZJH(this.conditions()).then(res => {
						const datas = res.data || {};
						// this.List = [...this.List,...datas.model];
						this.List = [...this.List,...datas];
						this.listCount =10 // datas.num;
						// if(this.List.length >= this.listCount){
							this.listStatus = 'nomore';
						// }
						console.log(this.List.length)
						uni.hideLoading();
					}).catch(() => {})
				}else if(this.planType==2){ //关联的计划
					this.$minApi.app._GetGRLGZJH(this.conditions()).then(res => {
						const datas = res.data || {};
						this.List = [...this.List,...datas.model];
						this.listCount = datas.num;
						
						if(this.List.length >= this.listCount){
							this.listStatus = 'nomore';
						}
						uni.hideLoading();
					}).catch(() => {})
				}else{
					
					// params.BMID = this.BMID || '';
					// params.YWYID = this.YWYID || '';
					// console.log(params)
					
					this.$u.api.getSubordinatePlan(this.conditions()).then(res => {
						const datas = res.data || {};
						this.List = [...this.List,...datas.model];
						this.listCount = datas.num || 0;
						
						if(datas.model.length < this.pageSize){
							this.listStatus = 'nomore';
						}
						
						uni.hideLoading();
					}).catch(()=>{})
				}
				
			},
			changeStatus(){
				this.goSearch();
			},
			change(val){
				this.goSearch();
			},
			open(index) {
				this.$refs.uDropdown.highlight();
				this.dropIdx = index;
			},
			
			open2(index) {
				this.$refs.uDropdown.highlight();
				this.dropIdx = index-1;
			},
			

			onCancel(){
				if(this.dropIdx=='1' && this.planDateVal.length==0){
					this.planCur = '';
				}
				if(this.dropIdx=='2' && this.finishDateVal.length==0){
					this.finishCur = '';
				} 
				this.selectVal=0;
			},
			onConfirm(d){
				this.selectPopShow=false;
			//	this.$refs.uDropdown.close();
				if(this.dropIdx=='1'){//计划时间
					this.planDateVal = d.value;
				}
				if(this.dropIdx=='2'){//完成时间
					this.finishDateVal = d.value;
				}
				this.goSearch();
			},
			selectDate(idx){
				this.selectVal=idx+2;
				if(this.dropIdx=='1'){ //计划时间
					this.planCur = idx;
					this.rangeVal = this.planDateVal;
					if(idx==1){
						this.planDateVal = [];
					}
				}
				if(this.dropIdx=='2'){ //完成时间
					this.finishCur = idx;
					this.rangeVal = this.finishDateVal;
					if(idx==1){
						this.finishDateVal = [];
					}
				}
				if(idx==1){
					this.goSearch();
				}
				if(idx==2){
					this.visible = true;
				}
			},
			
			selectSub(idx){
				const arr = this.subdepartmentList || [];
				if(this.BMID == arr[idx].ID){
					this.BMID = '';
				}else{
					this.BMID = arr[idx].ID;
				}
				this.goSearch();
			},
			selectSubPerson(index,idx){
				const arr = this.subList || [];
				const items = arr[index].items || [];
				if(this.YWYID == items[idx].id){
					this.YWYID = '';
				}else{
					this.YWYID = items[idx].id;
				}
				this.goSearch();
			},
			
			scrollBottom(){
				if(this.List.length < this.listCount){
					++this.pageNum;
					this.getList();
				}
			},
			getLabelFromID(id){
				const info = this.typeList.find(item => { return id == item.value; });
				if (info) {
				    return info.label;
				}
				return '';
			},
			goDetail(id,t){
				if(t==4){
					uni.navigateTo({
						url:`/packagePlan/pages/planDetailSub/index?id=${id}`
					})
				}else{
					uni.navigateTo({
						url:`/pages/member/agent/planDetail/index?id=${id}&planAuth=${t}`
					})
				}
				
			},
			getXSSJList(){
				this.$minApi.app._GetXSSJ().then(res => {
					this.subList = this._normalizeSinger(res.data.molist || []);
				}).catch(() => {})
			},
			_normalizeSinger(list){
				let map = {};
				list.forEach((item, index) => {
				  const key = item.index;
				  if (!map[key]) {
					map[key] = {
					  title: key,
					  items: []
					}
				  }
				  
				  map[key].items.push({
					name: item.KHJBXX.YGXM,
					id: item.KHJBXX.ID,
					SSZWBH:item.KHJBXX.SSZWBH
				  })
				})
				let ret = [], hot = [];
				for (let key in map) {
				  let val = map[key]
				  if (val.title.match(/[a-zA-Z0-9]/)) {
					ret.push(val)
				  }
				}
				ret.sort((a, b) => {
				  return a.title.charCodeAt(0) - b.title.charCodeAt(0)
				})
				return hot.concat(ret)
			}
		}
	}
</script>

<style scoped lang="scss">
	.u-page{
		width: 100%;
		height: 100%;
		overflow: hidden;
		&::v-deep .u-cell{
			padding: 0 40rpx;
			font-size: 28rpx;
			color: #7A808A;
			line-height: 80rpx;
		}
	}
	.search-box{ 
		.search-input{
			padding: 30rpx 40rpx 20rpx;
		}
	}
	.content{
		overflow: hidden;
	}
	.select-tag{
		margin: 20rpx 40rpx;
		font-size: 24rpx;
		color: #2A8FFC;
		background-color: #DEEDFC;
		border: 1px solid #2A8FFC;
		border-radius: 10rpx;
		line-height: 48rpx;
		text-align: center;
	}
	.list-head{
		padding: 0 18rpx;
		.head-title{
			font-size: 32rpx;
			color: #333333;
			line-height: 50rpx;
			margin-top: 10rpx;
		}
		.complete-num{
			font-size: 28rpx;
			color: $core-type-primary-dark;
			margin-left: 10rpx;
		}
		.head-time{
			font-size: 27rpx;
			color: #999;
		}
	}
	.list-body{
			font-size: 24rpx;
			padding: 15rpx 18rpx;
			.list-content{
				overflow: hidden;
				color: #666;
				margin-right: 40rpx;
				.plan-info{
					white-space:nowrap;
					overflow:hidden;
					text-overflow:ellipsis;
				}
			}
			.msg-num{
				color: #C0C0C0;
				margin-left: 6rpx;
			}
		}
	
	
	.select-time-list{
		height: 80rpx;
		border-top: 1px solid #f3f6fb;
		padding: 0 50rpx 0 40rpx;
		font-size: 28rpx;
		color: #7A808A;
		&.active{
			color: #2A8FFC;
			position: relative;
			&::after{
				content: '\e703';
				font-family: 'custom-icon';
				position: absolute;
				right: 50rpx;
				top: 50%;
				margin-top: -20rpx;
				font-size: 40rpx;
			}
		}
	}
	.add-btn{
		width: 80rpx;
		height: 80rpx;
		background-color: $core-type-primary-dark;
		text-align: center;
		line-height: 90rpx;
		border-radius: 50%;
		position: fixed;
		right: 50rpx;
		bottom: 80rpx;
		z-index: 10;
	}
	
	.sub-client-content{
		background-color: #fff;
		text-align: center;
		.active{
			color: $core-type-primary-dark;
		}
		.sub-content-box{
			font-size: 24rpx;
			&:nth-child(1){
				.sub-content{
					.title-icon{
						text{
							display: block;
						}
					}
				}
			}
			.sub-content{
				text-align: left;
				width: 100%;
				.title-icon{
					width: 100rpx;
					text-align: center;
					text{
						width: 30rpx;
						height: 30rpx;
						line-height: 30rpx;
						display: none;
						background: $core-type-primary-dark;
						color: #fff;
						border-radius: 50%;
						margin: 0 auto;
						font-size: 24rpx;
					}
				}
			}
		}
		
	}
	
	.disabled {
	  opacity: 0.5; /* 示例：使元素看起来不可点击 */
	  pointer-events: none; /* 阻止点击事件 */
	}
	.uCard{
		border: 1px solid #F7F7F7;background-color: #FFFFFF;border-radius:16rpx;min-height: 248rpx;margin:20rpx 20rpx 0 20rpx;
	}
	.cardShow{
		opacity: 1;
		pointer-events: all;
	}
	.cardNone{
		opacity: 0.1; 
		pointer-events: none;
	}
</style>